body {    
	display: grid;
    height: 100%;
	font-family: "Georgia", "Times New Roman", Times, serif;
	font-size: 1.5em;
	background-size: 100% 130%;	
	background-image: url("toamna.jpg");
	background-repeat: no-repeat;
}
#masthead {
	text-align: center;
	width: 100%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: blue;
	font-size: 50px;
}
#navigation {display: inline-block;
	position: relative;
	float: left;
	width: 20%;
	margin-top: 320px;
	margin-bottom: 10px;
}
#content {display: flex;
	float: left;
	position: relative;
	width: 80%;
	margin-top: -510px;
	margin-left: 170px;
	padding: 10px;
	border-radius: 45px;
	
}
#content1 {display: inline-block;
	float: left;
	position: relative;
	width: 80%;
	margin-top: -540px;
	margin-left: 170px;
	padding: 10px;
	border-radius: 45px;
	
}
#footer {display: inline-block;
	text-align: center;
	width: 100%;
    border:#0000FF 3px solid;
    border-radius: 45px;
}
#masthead h1 {
	color: #000080;
}
#masthead h3,h2,h4 {
	color: #004AAD;
}
#content1 p,a {color: #004AAD;}
#content h1,h2,h3,h4,h5,h6 {
	color: #004AAD;
}
#footer a {
	border-color: #0000FF;
	color: #004AAD;
	text-decoration: underline;
}
#footer a:hover {
	color: #004AAD;
	text-decoration: none;
}
.Btn {
    position: relative;
    width: 150px;
    height: 55px;
    border-radius: 45px;
    border: none;
    background-color: rgb(60, 188, 255);
    color: white;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
		font-size: 1.2em;
}

.Bmic
{
	position: relative;
    width: 150px;
    height: 55px;
    border-radius: 45px;
    border: none;
    background-color: rgb(60, 188, 120);
    color: white;
    box-shadow: 0px 10px 10px rgb(60, 180, 110) inset,
        0px 5px 10px rgba(60, 180, 110, 0.212),
        0px -10px 10px rgb(60, 180, 110) inset;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
	font-size:1.1em;
}
.Btn::before {
    width: 70%;
    height: 2px;
    position: absolute;
    background-color: rgba(60, 188, 255, 0.7);
    content: "";
    filter: blur(1px);
    top: 7px;
    border-radius: 50%;
}
.Btn::after {
    width: 70%;
    height: 2px;
    position: absolute;
    background-color: rgba(60, 188, 255, 0.1);
    content: "";
    filter: blur(1px);
    bottom: 7px;
    border-radius: 50%;
}
.Btn2 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("email.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn3 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("oa.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn7 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("cisco.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn4 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("catalog.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn5 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("365.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn6 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("bebras.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn8 {
    position: relative;
    width: 200px;
    height: 120px;
    border-radius: 45px;
    border: none;
	background-image:url("apex.png");
	background-size: 100% 90%;	
    color: red;
    box-shadow: 0px 10px 10px rgb(50, 180, 253) inset,
        0px 5px 10px rgba(50, 180, 253, 0.212),
        0px -10px 10px rgb(50, 180, 255) inset;
    cursor: pointer;
    display: inline-block;
    align-items: center;
    justify-content: center;
	font-size: 0.7em;
}
.Btn:hover, .Btn6:hover,.Btn5:hover,.Btn4:hover,.Btn8:hover,.Btn7:hover,.Btn3:hover, .Btn2:hover, .Bmic:hover {
    animation: jello-horizontal 0.9s both;
}
@keyframes jello-horizontal {
    0% {transform: scale3d(1, 1, 1);}
    30% {transform: scale3d(1.25, 0.75, 1);}
    40% {transform: scale3d(0.75, 1.25, 1);}
    50% {transform: scale3d(1.15, 0.85, 1);}
    65% {transform: scale3d(0.95, 1.05, 1);}
    75% {transform: scale3d(1.05, 0.95, 1);}
    100% {transform: scale3d(1, 1, 1);}
}